import classNames from "classnames";
import "./index.scss";
import React from "react";

function XtxSkeleton({
  width = "100px",
  height = "100px",
  animated = false,
  bg = "#efefef",
  className = "",
  style = {},
}: {
  width?: string;
  height?: string;
  animated?: boolean;
  bg?: string;
  className?: string;
  style?: React.CSSProperties;
}) {
  const combinedStyle = {
    width,
    height,
    ...style, // 合并外部传入的 style 属性
  };
  return (
    <div
      className={classNames(`xtx-skeleton ${className}`, {
        shan: animated,
      })}
      style={combinedStyle}
    >
      <div className="block" style={{ backgroundColor: bg }}></div>
    </div>
  );
}

export default XtxSkeleton;
